{% extends "base.html" %}

{% block content %}
  <div ng-controller="ReaderExploration">

    <div class="oppia-content">
      <div class="oppia-exploration-header">
        <h3><[title]></h3>
      </div>
      <div class="oppia-iframe-container oppia-exploration">
        <a ng-click="initializePage()" class="pull-right">Start again?</a>
        <br><br>

        <div angular-html-bind="html"></div>
        <div angular-html-bind="oppiaHtml" class="oppia-response" ng-show="oppiaHtml">
        </div>
        <br>
        <div ng-show="finished" class="oppia-response">
          Congratulations, you've finished this exploration!
          Would you like to <a ng-click="initializePage()">play again?</a>
        </div>

        <iframe id="inputTemplate" width="100%"
            frameborder="0" height="400px"></iframe>
      </div>
    </div>

  </div>
{% endblock %}
